<script setup>
import {useRoute, useRouter} from "vue-router";
import {onMounted, ref, getCurrentInstance, reactive, defineComponent, watch} from "vue";

const dataRuleValue = ref({})
const queryRuleValue = ref({
  // ja_sort: "$param.did"
})
const queryRuleValue1 = ref(null)
const mappingRuleValue = ref({})
const mapRulesValue = ref({})
const linkQueryValue = ref({})
const ruleValue = ref({})

</script>

<template>
  <div>
    {{ dataRuleValue }}
    <SimpleJsonParam v-model="dataRuleValue"></SimpleJsonParam>
  </div>
  <div>
    {{ queryRuleValue }}
    <QueryRules v-model="queryRuleValue" :allow-custom="true" :input-form-id="116" :has-param="true"
                :has-var="true"></QueryRules>
    <p>-----</p>
    {{ queryRuleValue1 }}
    <QueryRules v-model="queryRuleValue1" :has-param="true" :allow-custom="true" :is-view="true"></QueryRules>
  </div>
  <div>
    mappingRuleValue: {{ mappingRuleValue }}
    <MappingRules v-model="mappingRuleValue" :target-form-id="116" :rela-form-id="135"></MappingRules>
  </div>
  <div>
    mapRulesValue: {{ mapRulesValue }}
    <MapRules v-model="mapRulesValue" :target-form-id="116" :rela-form-id="135"></MapRules>
  </div>
  <div>
    {{ linkQueryValue }}
    <LinkQuery v-model="linkQueryValue" :allow-custom="true" :input-form-id="116" :has-param="true"></LinkQuery>
  </div>

  <h5>user: {{ ruleValue }}</h5>
  <Rules v-model="ruleValue" type="user" :rela-form-id="137"></Rules>
  <h5>view:</h5>
  <Rules v-model="ruleValue" type="view" :input-form-id="115"></Rules>
  <h5>data:</h5>
  <Rules v-model="ruleValue" type="data" :input-form-id="115" :rela-form-id="137"></Rules>
  <h5>bool:</h5>
  <Rules v-model="ruleValue" type="bool" :input-form-id="115"></Rules>
</template>
